import { commentDefaultContent } from "@const";

export default () => {
  const descriptionTextArea = document.querySelector('#comment') as HTMLTextAreaElement;
  const versionLabel = document.querySelector('#field_label_version') as HTMLTableCellElement;
  const guessNote = document.querySelector('#os_guess_note') as HTMLTableCellElement;
  const commit = document.querySelector('#commit') as HTMLInputElement;
  const shortDesc = document.querySelector('#short_desc') as HTMLInputElement;
  const attachFalseInput = document.querySelector('#attachment_false input') as HTMLInputElement;
  const attachTrueInput = document.querySelector('#attachment_true input') as HTMLInputElement;
  const attatchData = document.querySelector('#attachment_true .attachment_entry input') as HTMLInputElement;
  const priority = document.querySelector('#field_label_priority') as HTMLTableCellElement;
  const topTip = document.querySelector('form table tr') as HTMLTableCellElement;
  const products = Array.from(document.querySelectorAll('table th[valign="top"] a')) as HTMLLinkElement[];
  const productDescs = Array.from(document.querySelectorAll('table td[valign="top"]')) as HTMLTableCellElement[];

  if (descriptionTextArea) {
    descriptionTextArea.rows = 16;
    descriptionTextArea.value = commentDefaultContent;
    descriptionTextArea.onfocus = null;
    descriptionTextArea.addEventListener("focus", (e) => {
      e.preventDefault();
      e.stopPropagation();
    });
  }

  if (versionLabel) {
    versionLabel.rowSpan = 1;
    (versionLabel.nextElementSibling as HTMLTableCellElement).rowSpan = 1;
  }

  if (guessNote) {
    (guessNote.parentNode?.firstElementChild as HTMLTableCellElement).colSpan = 1;
    (guessNote.firstElementChild as HTMLDivElement).innerText = "已经预填部分字段，请自行检查正确与否"
  }

  if (commit) {
    commit.classList.add("custom-button");
    commit.value = "提交 bug";
  }

  if (shortDesc) {
    shortDesc.addEventListener("input", (e: any) => {
      const errorComponents = Array.from(document.querySelectorAll(".validation_error_text")) as HTMLDivElement[];
      if (e.target.value) {
        errorComponents.forEach((error) => {
          if (error.innerText == "You must enter a Summary for this bug.") {
            error.classList.add("bz_default_hidden");
          }
        })
      } else {
        errorComponents.forEach((error) => {
          if (error.innerText == "You must enter a Summary for this bug.") {
            error.classList.remove("bz_default_hidden");
          }
        })
      }
    })
  }

  if (attachFalseInput && attachTrueInput && attatchData) {
    attachFalseInput.value = "上传附件";
    attachTrueInput.value = "取消上传";
    attachFalseInput.classList.add("custom-button");
    attachFalseInput.classList.add("plain-button");
    attachTrueInput.classList.add("custom-button");
    attachTrueInput.classList.add("plain-button");

    const uploadFileBtn = document.createElement("span");
    const fileName = document.createElement("span");
    uploadFileBtn.classList.add("custom-button");
    uploadFileBtn.classList.add("plain-button");
    uploadFileBtn.innerText = "重新上传"

    fileName.classList.add("bug-new_filename")

    attatchData.classList.add("bz_default_hidden");
    attatchData.parentNode?.insertBefore(fileName, attatchData.nextElementSibling);
    attatchData.parentNode?.insertBefore(uploadFileBtn, attatchData.nextElementSibling);
    
    attachFalseInput.addEventListener("click", () => {
      attatchData.click();
    });
    uploadFileBtn.addEventListener("click", () => {
      attatchData.click();
    });

    attatchData.addEventListener("change", (e: any) => {
      const pathArr = (e.target.value as string).split("\\");
      const sizeM = e.target.files[0].size / 1024;
      fileName.innerText = "文件名：" + pathArr[pathArr.length - 1] + " " + "大小：" + sizeM.toFixed(2) + "kb";
      
    })
  }

  if (topTip) {
    topTip.remove();
  }

  if (priority) {
    priority.parentElement?.firstElementChild?.remove();
  }

  if (products.length) {
    products.forEach((p) => {
      p.classList.add("custom-button");
      p.addEventListener("click", (e) => {
        e.preventDefault();
        window.open(p.href, "_blank");
      })
    })
  }

  if (productDescs.length) {
    productDescs.forEach((pd) => {
      pd.vAlign = "center";
    })
  }
}